<template>
    <Swiper>
        <SwiperItem v-for="item in banners">
            <a :href="item.link">
                <img @load="imageLoad" :src="item.image" alt="">
            </a>
        </SwiperItem>
    </Swiper>
</template>

<script>
import { Swiper, SwiperItem } from '../../../components/common/swiper/index.js'
export default {
    name: 'HomeSwiper',
    data() {
        return {
            isLoad: false
        }
    },
    props: {
        banners: {
            type: Array,
            default() {
                return []
            }
        }
    },
    methods: {
        imageLoad() {
            if (!this.isLoad) {
                setTimeout(()=>{
                    this.$emit('swiperImageLoad')
                    this.isLoad = true
                }, 0)
            }
        }
    },
    components: {
        Swiper,
        SwiperItem
    }
}
</script>

<style scoped>
</style>